<template>
    <div>
        <el-container>
          <el-header style="background-color: #092c47;line-height: 50px;">
              <h1 style="font-size: 30px;margin: 0;color: #fff;">烘焙坊后台管理页面
                <span style="font-size: 20px;float: right;">
                  欢迎&nbsp;<span style="color: orange;">{{user.username}}</span>&nbsp;回来
                  <a href="javascript:void(0)" style="color: orange;text-decoration: none;" >
                    退出登录
                  </a>
                </span>
              </h1>

          </el-header>
          <el-container>
            <el-aside width="200px" >
                  <el-menu active-text-color="orange" router >
                    <img style="margin-top: 20px;margin-left: 20px;" src="/imgs/icon.png" width="150px">
                    <el-divider></el-divider>
                    <el-menu-item index="/admin/index" >
                      <i class="el-icon-user-solid">用户管理</i>
                    </el-menu-item>
                    <el-menu-item index="/admin/banner">
                      <i class="el-icon-picture">轮播图管理</i>
                    </el-menu-item>
                    <el-menu-item index="/admin/content">
                      <i class="el-icon-s-order">内容管理</i>
                    </el-menu-item>

                  </el-menu>


            </el-aside>
            <el-main>
                <router-view></router-view>
            </el-main>
          </el-container>
        </el-container>

    </div>
</template>

<script>
export default {
  data() {
    return {
      user: {
        username:'花乐乐'
      }
    }
  },
}
</script>

<style scoped>
  i{
    font-style: normal;
  }
</style>
